import {messages} from "share/common";
import React from 'react';
import {connect} from 'react-redux';
import { Menu, Layout } from 'antd';
import 'styles/supplier-management/airline-config/airline-config.scss';
import SearchConfig from './airline-config-search';
import VendorConfig from './airline-config-vendor';
import PolicyConfig from './airline-config-policy';
import BookingConfig from './airline-config-booking';
import RefundConfig from './airline-config-refund';

const { Content, Sider } = Layout;
const components = {
  search: SearchConfig,
  vendor: VendorConfig,
  booking: BookingConfig,
  policy: PolicyConfig,
  refund: RefundConfig
};

class AirlineConfig extends React.Component {
  constructor() {
    super();
    this.state = {
      companyOID: '',
      current: 'search'
    };
  }
  handClick = (e) => {
    this.setState({
      current: e.key,
    });
  }
  render = () => {
    const { current } = this.state;
    const TabComponent = components[current];
    return (
      <Layout className="airline-config">
        <Sider style={{background: '#fff'}}>
          <Menu
            onClick={this.handClick}
            selectedKeys={[this.state.current]}
            defaultSelectedKeys={['search']}
            style={{height: '100%'}}
          >
            <Menu.Item key="search">{messages('supplier.key267')/*机票查询配置*/}</Menu.Item>
            <Menu.Item key="vendor">{messages('supplier.key268')/*消费商设置*/}</Menu.Item>
            <Menu.Item key="booking">{messages('supplier.key269')/*预订管控配置*/}</Menu.Item>
            <Menu.Item key="policy">{messages('supplier.key270')/*差旅政策配置*/}</Menu.Item>
            <Menu.Item key="refund">{messages('supplier.key582')/*退改签设置*/}</Menu.Item>
          </Menu>
        </Sider>
        <Content style={{background: '#fff'}}>
          <TabComponent companyOID={this.props.params.companyOID} />
        </Content>
      </Layout>
    );
  }
}

function mapStateToProps() {
  return {};
}

export default connect(mapStateToProps)(AirlineConfig);
